<template>
    <div class="question">
        <div class="question-list mt20">
            <el-form :model="ruleForm" ref="ruleForm" label-width="100px" class="demo-ruleForm">
                <el-form-item label="题目" prop="name">
                    <!-- <vue-ueditor-wrap v-model="ruleForm.name" :config="myConfig"></vue-ueditor-wrap> -->
                    <uEditor ref="ue1"></uEditor>
                </el-form-item>
                <el-form-item label="答案">
                    <el-radio-group v-model="ruleForm.value">
                        <el-radio :label="index" v-for="(item,index) in selectOptions" :key="index">{{item.label}}</el-radio>
                    </el-radio-group>
                </el-form-item>
                <!--   <el-form-item label="">
                    <el-button type="primary" @click="handleAddOption">增加选项</el-button>
                </el-form-item> -->
                <el-form-item label="正确答案">
                    <span class="right-answer">{{ruleForm.value == 0?"正确":"错误"}}</span>
                </el-form-item>
                <el-form-item label="题目解析" prop="desc">
                    <uEditor ref="ue2"></uEditor>
                </el-form-item>
                <el-col :span="24" class="el-item">
                    <el-form-item label="章" prop="chapterId" class="item">
                        <el-select v-model="ruleForm.chapterId" placeholder="请选择章" @change="checkChapter">
                            <el-option :label="subItem.name" :value="subItem.id" v-for="(subItem,subIndex) in chapterList"
                                :key="subIndex"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="节" prop="sectionId" class="item">
                        <el-select v-model="ruleForm.sectionId" placeholder="请选择节" @change="checkSection">
                            <el-option :label="subItem.name" :value="subItem.id" v-for="(subItem,subIndex) in sectionList"
                                :key="subIndex"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="考点" prop="pointId" class="item">
                        <el-select v-model="ruleForm.pointId" placeholder="请选择考点">
                            <el-option :label="subItem.name" :value="subItem.id" v-for="(subItem,subIndex) in siteList"
                                :key="subIndex"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="难度" prop="diff" class="item">
                        <el-select v-model="ruleForm.diff" placeholder="">
                            <el-option label="简单" value="1"></el-option>
                            <el-option label="一般" value="5"></el-option>
                            <el-option label="困难" value="10"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item>
                        <el-button type="primary" @click="getContent()">保存</el-button>
                        <el-button @click="close">取消</el-button>
                    </el-form-item>
                </el-col>
            </el-form>

        </div>
    </div>
</template>

<script>
    export default {
        props: {
            subName: String,
            id: String,
            isEditSon: Boolean,
            qId: String,
            type: String
        },
        data() {
            return {
                subId: this.id,
                qid: this.qId,
                ruleForm: {
                    context: '',
                    chapterId: '',
                    secitonId: '',
                    pointId: '',
                    diff: `1`,
                    value: 0,
                    analysis: '',
                    isRight: 0
                },
                selectOptions: [{
                    label: '正确',
                    isRight: 0
                }, {
                    label: '错误',
                    isRight: 1
                }],
                chapterList: [],
                sectionList: [],
                siteList: []
            }
        },
        created() {
            if (this.isEditSon == true) {
                setTimeout(res => {
                    this.getData()
                }, 100)
            }
        },
        mounted() {
            this.getChapterList()
        },
        methods: {
            getData() {
                let data = {
                    id: localStorage.getItem('sonId')
                };
                let url = '/subject/info';
                let params = {
                    data: this.$aes.encrypt(JSON.stringify(data), '0000000000000000'),
                    token: this.$store.state.token
                };
                this.$axios.post(url, params).then(res => {
                    console.log(res);
                    this.$nextTick(() => {
                        this.$refs.ue1.context = res.obj.stem;
                        this.ruleForm.chapterId = res.obj.chapterId;
                        this.ruleForm.sectionId = res.obj.sectionId;
                        this.ruleForm.pointId = res.obj.pointId;
                        this.ruleForm.diff = String(res.obj.difficulty);
                        this.$refs.ue2.context = res.obj.analysis;
                        let Index = res.obj.answers.map(res => {
                            return res.yes
                        }).indexOf(1);
                        this.ruleForm.value = this.selectOptions[Index].isRight;
                        // console.log(Index);
                        // console.log(this.selectOptions);
                        this.ruleForm.isRight = this.selectOptions[Index].isRight;
                    });
                })
            },
            resetIndex(Index) {
                for (var i = 0; i < Index.length; i++) {
                    if (Index[i] === undefined)
                        Index.splice(i, 1);
                }
                return Index
            },
            arrSet(Arr) {
                let arr = [];
                Arr.forEach((item, index) => {
                    let items = {
                        value: item.val,
                        isRight: index + 1
                    }
                    arr.push(items)
                })
                return arr
            },
            //获取章/节/考点选项
            getChapterList() {
                let data = {
                    name: '',
                    pid: this.subId,
                    type: 5
                };
                let url = '/section/page';
                let params = {
                    data: this.$aes.encrypt(JSON.stringify(data), '0000000000000000'),
                    token: this.$store.state.token
                };
                this.$axios.post(url, params).then(res => {
                    if (res.obj.total != 0) {
                        this.chapterList = res.obj.records;
                        this.getSectionList(res.obj.records[0].id)
                        this.chapterId = res.obj.records[0].id
                    } else {
                        this.chapterList = res.obj.items
                    }
                })
            },
            getSectionList(id) {
                let data = {
                    name: '',
                    pid: id,
                    type: 10
                };
                let url = '/section/page';
                let params = {
                    data: this.$aes.encrypt(JSON.stringify(data), '0000000000000000'),
                    token: this.$store.state.token
                };
                this.$axios.post(url, params).then(res => {
                    if (res.obj.total != 0) {
                        this.sectionList = res.obj.records
                        this.secitonId = res.obj.records[0].id
                        this.getSiteList(res.obj.records[0].id)
                    } else {
                        this.sectionList = res.obj.items;
                        this.siteList = []
                        this.secitonId = ''
                    }
                })
            },
            getSiteList(id) {
                let data = {
                    name: '',
                    pid: id,
                    type: 15
                };
                let url = '/section/page';
                let params = {
                    data: this.$aes.encrypt(JSON.stringify(data), '0000000000000000'),
                    token: this.$store.state.token
                };
                this.$axios.post(url, params).then(res => {
                    if (res.obj.total != 0) {
                        this.siteList = res.obj.records
                    } else {
                        this.siteList = res.obj.items
                    }
                })

            },
            //选择正确答案
            selectRight(e) {
                this.ruleForm.isRight = e
            },
            //选择章节
            checkChapter(e) {
                this.getSectionList(e)
            },
            checkSection(e) {
                this.getSiteList(e)
            },
            arrReset() {
                let arr = [];
                this.selectOptions.forEach((item, index) => {
                    let items = {
                        key: String.fromCharCode(index + 65),
                        val: item.label,
                        yes: this.ruleForm.value == item.isRight ? 1 : 0
                    }
                    arr.push(items)
                })
                return arr
            },
            resetForm(formName) {
                this.$refs[formName].resetFields();
            },
            resetNum(num) {
                return String.fromCharCode(num + 65)
            },
            close() {
                this.$emit('closeAdd')
            },
            getContent() {
                if (this.$refs.ue1.context == '') return this.$message.error('题目不能为空');
                if (this.ruleForm.chapterId == '') return this.$message.error('章不能为空');
                if (this.ruleForm.sectionId == '') return this.$message.error('节不能为空');
                if (this.ruleForm.pointId == '') return this.$message.error('考点不能为空');
                let data;
                let url;
                if (this.isEditSon == true) {
                    data = {
                        id: localStorage.getItem('sonId'),
                        libraryId: this.$store.state.libId,
                        courseId: this.subId,
                        chapterId: this.ruleForm.chapterId,
                        sectionId: this.ruleForm.sectionId,
                        pointId: this.ruleForm.pointId,
                        stem: this.$refs.ue1.context,
                        pid: this.qid,
                        type: this.type,
                        analysis: this.$refs.ue2.context,
                        difficulty: parseInt(this.ruleForm.diff),
                        status: 1,
                        creater: ``,
                        publisher: ``,
                        answers: this.arrReset(),
                    };
                    url = '/subject/edit';
                } else {
                    data = {
                        libraryId: this.$store.state.libId,
                        courseId: this.subId,
                        chapterId: this.ruleForm.chapterId,
                        sectionId: this.ruleForm.sectionId,
                        pointId: this.ruleForm.pointId,
                        pid: this.qid,
                        stem: this.$refs.ue1.context,
                        type: this.type,
                        analysis: this.$refs.ue2.context,
                        difficulty: parseInt(this.ruleForm.diff),
                        status: 1,
                        creater: ``,
                        publisher: ``,
                        answers: this.arrReset(),
                    };
                    url = '/subject/save';
                }
                let params = {
                    data: this.$aes.encrypt(JSON.stringify(data), '0000000000000000'),
                    token: this.$store.state.token
                };
                this.$axios.post(url, params).then(res => {
                    if (res.code == 1) {
                        this.$emit('update')
                        this.$message.success("保存成功")
                    } else {
                        this.$message.error(res.msg);
                    }
                })
            }

        }
    }
</script>

<style scoped lang="scss">
    @import './test.scss'
</style>
